<!-- Copyright (c) 2019-2020 十三 all rights reserved. -->
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="header::head-fragment('NewBee商城-首页','index')">
</head>
<body>
<header th:replace="/header::header-fragment"></header>
<content id="content">
    <nav th:replace="header::nav-fragment"></nav>
    <div id="banner">
        <div class="all-sort-list">
            <th:block th:each="category : ${categories}">
            <div class="item">
                <h3><span>·</span><a th:href="'/search/int?keyword='+${category.getId()}"><th:block th:text="${category.getCategory()}"></th:block></a></h3>
                <div class="item-list clearfix">
                    <div class="subitem"></div>
                </div>
            </div>
            </th:block>
        </div>
        <div class="swiper-container fl">
            <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <img src="https://img10.360buyimg.com/cms/jfs/t1/166138/20/14803/205017/605dca51E115e0f26/83799f646831bc52.jpg" alt="">
                    </div>
                    <div class="swiper-slide">
                        <img src="https://img12.360buyimg.com/cms/jfs/t1/164922/3/14270/146108/60586045E7ed1e2ce/896b70d380080fbc.jpg" alt="">
                    </div>
                    <div class="swiper-slide">
                        <img src="https://img11.360buyimg.com/cms/jfs/t1/162660/10/4162/136010/601264bfEb0eee94d/9fc21503853f2b5f.jpg" alt="">
                    </div>
            </div>
            <div class="swiper-pagination"></div>
            <div class="swiper-button-prev"></div>
            <div class="swiper-button-next"></div>
        </div>
    </div>

    <div id="sub_banner">
        <!-- 已配置热销商品则显示配置内容 -->
        <th:block th:unless="${#lists.isEmpty(books)}">
            <th:block th:each="hotGoodse : ${books}">
                <div class="hot-image">
                    <a th:href="@{'/book?bookid='+${hotGoodse.getId()}}">
                        <img th:src="@{${hotGoodse.getBookImg()}}" th:alt="${hotGoodse.getBookName()}">
                    </a>
                </div>
            </th:block>
        </th:block>

    </div>

    <div id="flash">
        <h2>新品上线</h2>
        <ul>
            <!-- 已配置新品则显示配置内容 -->
            <th:block th:unless="${#lists.isEmpty(bookNew)}">
                <th:block th:each="newGoods : ${bookNew}">
                    <li>
                        <a th:href="@{'/book?bookid='+${newGoods.getId()}}">
                            <img th:src="@{${newGoods.getBookImg()}}" th:alt="${newGoods.getBookName()}">
                            <p class="name" th:text="${newGoods.getBookName()}">NewBeeMall</p>
                            <p class="item_price" th:text="${newGoods.getPrice()}">NewBeeMall</p>
                        </a>
                    </li>
                </th:block>
            </th:block>
        </ul>
    </div>
</content>
<script th:src="@{/templates/manager/plugins/jquery/jquery.min.js}"></script>
<!-- Bootstrap 4 -->
<script th:src="@{/templates/manager/plugins/bootstrap/js/bootstrap.bundle.min.js}"></script>
<script th:src="@{/js/swiper-bundle.min.js}" type="text/javascript"></script>
<script th:src="@{/templates/manager/plugins/sweetalert/sweetalert.min.js}"></script>
<script th:src="@{/js/index.js}" type="text/javascript"></script>
<script th:src="@{/js/search.js}" type="text/javascript"></script>
</body>
</html>